<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}" media="all">
</head>
<body>
<div class="layui-container" style="width: 700px;height: 600px;margin-top: 0px;padding-top: 60px;">

    <div style="margin-left: 460px; width: 200px;">
        欢迎回来！
        <a href="/consumer/redirect/order" th:text="${session.user.nickname}"></a>
        <a href="/consumer/account/logout">
            <button class="layui-btn layui-btn-warm layui-btn-radius">退出</button>
        </a>
    </div>

    <table class="layui-hide" id="test" lay-filter="test"></table>
    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-xs" lay-event="order">订购</a>
<!--        <a class="layui-btn layui-btn-xs" lay-event="modify">修改</a>-->
<!--        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>-->
    </script>
    <script th:src="@{/layui/layui.js}" charset="utf-8"></script>
    <script>
        layui.use('table', function () {
            var table = layui.table;

            table.render({
                elem: '#test'
                , url: '/consumer/menu/findAllWithType'
                , title: '菜单列表'
                , cols: [
                    [
                        {field: 'id', width: 100, title: '编号', sort: true}
                        , {field: 'name', width: 200, title: '菜品'}
                        , {field: 'price', width: 100, title: '单价'}
                        , {field: 'flavor', width: 100, title: '口味'}
                        , {
                        field: 'type', width: 100, title: '分类', templet: function (data) {
                            return data.type.name;
                        }
                    }
                        , {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 130}
                    ]
                ]
                , page: true
            });

            //监听行工具事件
            table.on('tool(test)', function (obj) {
                var data = obj.data;
                if (obj.event === 'order') {
                    // layer.alert("订购");
                    window.location.href = "/consumer/order/save/" + data.id;
                }
                // if (obj.event === 'modify') {
                //     // layer.alert("修改");
                //     window.location.href = "/consumer/menu/findById/" + data.id;
                // }
                // if (obj.event === 'delete') {
                //     layer.confirm('真的删除么', function (index) {
                //         // obj.del();
                //         layer.close(index);
                //         window.location.href = "/consumer/menu/deleteById/" + data.id;
                //     });
                // }
            });
        });
    </script>

</div>
<script>
    //二级菜单联动
    layui.use('element', function () {
        var element = layui.element;

    });
</script>
</body>
</html>